import 'package:flutter/material.dart';

// 程序入口，启动 Flutter 应用
void main() {
  runApp(const MyApp());
}

// 应用的主类，继承 StatelessWidget，因为应用本身不管理状态
class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: '按钮示例应用', // ：标题为中文，简洁明了
      theme: ThemeData(
        primarySwatch: Colors.indigo, // ：主题色从 blue 为 indigo
        elevatedButtonTheme: ElevatedButtonThemeData(
          style: ElevatedButton.styleFrom(
            padding: const EdgeInsets.symmetric(
              horizontal: 16,
              vertical: 12,
            ), // ：统一按钮内边距
          ),
        ),
      ),
      home: const ButtonDemoPage(),
    );
  }
}

// 按钮演示页面，展示不同类型的 Flutter 按钮
class ButtonDemoPage extends StatelessWidget {
  const ButtonDemoPage({super.key});

  // 点击事件处理方法，根据按钮类型打印不同信息
  void _onPressed(String buttonType) {
    print('$buttonType 按钮被点击了！'); // ：输出具体按钮类型
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('按钮类型展示'), // ：标题为更具体的中文
        centerTitle: true, // ：标题居中
      ),
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min, // 使 Column 只占用必要空间
          children: [
            // 提升按钮（ElevatedButton）
            ElevatedButton(
              onPressed: () => _onPressed('提升按钮'),
              child: const Text(
                '普通提升按钮', // ：文字为中文
                style: TextStyle(fontSize: 16), // ：设置字体大小
              ),
            ),
            const SizedBox(height: 12), // ：增加间距
            // 文本按钮（TextButton）
            TextButton(
              onPressed: () => _onPressed('文本按钮'),
              child: const Text(
                '普通文本按钮',
                style: TextStyle(
                  fontSize: 16,
                  color: Colors.indigoAccent,
                ), // ：添加颜色
              ),
            ),
            const SizedBox(height: 12),
            // 图标按钮（IconButton）
            IconButton(
              icon: const Icon(Icons.favorite), // ：更换图标
              onPressed: () => _onPressed('图标按钮'),
              iconSize: 32, // ：增大图标大小
              color: Colors.indigo, // ：设置图标颜色
            ),
            const SizedBox(height: 12),
            // 带图标的提升按钮
            ElevatedButton.icon(
              icon: const Icon(Icons.send_rounded), // ：使用圆角图标
              label: const Text('发送消息'), // ：文字为中文
              onPressed: () => _onPressed('带图标的提升按钮'),
            ),
            const SizedBox(height: 12),
            // 带图标的轮廓按钮
            OutlinedButton.icon(
              icon: const Icon(Icons.add_circle_outline), // ：更换图标
              label: const Text('添加项目'), // ：文字为中文
              onPressed: () => _onPressed('带图标的轮廓按钮'),
              style: OutlinedButton.styleFrom(
                side: const BorderSide(color: Colors.indigo), // ：设置边框颜色
              ),
            ),
            const SizedBox(height: 12),
            // 带图标的文本按钮
            TextButton.icon(
              icon: const Icon(Icons.info_outline), // ：更换图标
              label: const Text('查看详情'), // ：文字为中文
              onPressed: () => _onPressed('带图标的文本按钮'),
              style: TextButton.styleFrom(
                foregroundColor: Colors.indigoAccent, // ：设置前景色
              ),
            ),
          ],
        ),
      ),
    );
  }
}
